<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ToDoList 任务管理器</title>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>

<h1>ToDoList 任务管理器</h1>

<input type="text" id="taskInput" placeholder="输入任务...">
<button id="addTaskBtn">添加任务</button>

<ul id="taskList">
<!-- 任务将会在这里动态添加 -->
</ul>

<script>
$(document).ready(function(){
    $("#addTaskBtn").click(function(){
        var task = $("#taskInput").val();
        if(task !== ""){
            $("#taskList").append("<li>" + task + "</li>");
            $("#taskInput").val(""); // 添加任务后清空输入框
        }
    });
});
</script>

</body>
</html>
